<template>
  <div>
    <el-table :data="jobList" style="width: 100%">
      <el-table-column prop="id" label="ID"></el-table-column>
      <el-table-column prop="jobName" label="职位名称"></el-table-column>
      <el-table-column prop="jobDesc" label="职位描述"></el-table-column>
      <el-table-column  label="状态">
        <template slot-scope="scope">
         <el-tag>{{ scope.row.status==1?'启用':'禁用' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="interviewerName" label="面试官"></el-table-column>
      <el-table-column prop="prompt" label="提示词前缀"></el-table-column>
      <el-table-column prop="createTime" label="创建时间"></el-table-column>
      <el-table-column prop="updatedTime" label="更新时间"></el-table-column>
    </el-table>
    <el-pagination
        background
        layout="prev, pager, next"
        :total="total"
        :page-size="pageSize"
        :current-page="currentPage"
        @current-change="handleCurrentChange"
    ></el-pagination>
  </div>
</template>

<script>

import axios from "axios";
export default {
  data() {
    return {
      pageForm:{
        pageNum:1,
        pageSize:10
      },
      jobList: [],
      total: 0,
      pageSize: 10,
      currentPage: 1
    };
  },
  created() {
    // 在组件创建时调用获取数据的方法
    this.fetchJobList();
  },

  methods: {
    handleCurrentChange(page) {
      this.pageForm.pageNum = page;
      // 这里可以添加获取数据的方法，例如从API获取数据
      this.fetchJobList();
    },
    fetchJobList() {
      // 这里可以发送Axios请求获取数据，根据currentPage和pageSize来获取分页数据
      // 假设这里有一个名为fetchData的方法来获取数据
      axios.post('http://localhost:8781/job/listJob',this.pageForm ).then(res=>{

        console.log(res)
        this.jobList = res.data.data.list;
        console.log(res.data.total)
        this.total = res.data.data.total;

      })
    }
  }



};
</script>

<style scoped>
</style>